<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>分区元素</title>
</head>
<body>
        <!--  行内分区元素 不会换行 用于选中一行中的一部分内容  -->
        雪侵染<span style="color: cyan">万千华光</span>钟声溯佛龛
        <br>
        欢迎各位小可爱进入<span style="color: green;">JSDTN2409</span>班学习<span style="color: blue">第三阶段</span>!
        <br>
        <!--    块级分区元素   独占一行(默认宽度为父级宽度的100%)，但高度为0!要靠内容撑起来!    -->
        <div></div>
        窝嫩叠
        <div>窝嫩叠</div>
        窝嫩叠
        <hr>
        <div class="header">顶部条</div>
        <div class="nav">导航栏</div>
        <div class="aside">侧边栏</div>
        <div class="main"> 主体内容</div>
        <div class="section">某个区域</div>
        <div class="article">文章</div>
        <div class="footer">底部条</div>
        <hr>
        <header>顶部条</header>
        <nav>导航栏</nav>
        <aside>侧边栏</aside>
        <main> 主体内容</main>
        <section>某个区域</section>
        <article>文章</article>
        <footer>底部条</footer>

</body>
</html>